<!--
 * @Author: fengYM feng25321@163.com
 * @Date: 2023-09-25 13:43:26
 * @LastEditors: fengYM feng25321@163.com
 * @LastEditTime: 2023-10-17 14:11:38
 * @Description: 订单列表
-->
<template>
  <view class="">
    <view style="background: #fff">
      <u-tabs
        :list="tabList"
        @click="tabClick"
        :activeStyle="{
          color: '#333',
          fontWeight: 'bold',
          transform: 'scale(1.05)',
        }"
        :current="tabActive.index"
        lineWidth="28"
        :inactiveStyle="{
          color: '#686586',
        }"
        lineColor="#81D8D0"
      ></u-tabs>
    </view>
    <view class="main">
      <template v-if="orderList?.length > 0">
        <view>
          <GoodsOrderItem
            v-for="(item, index) in orderList"
            :key="item.goodId"
            @click="goPage(`/pages/shop/goodsDetails/goodsOrderDetails?orderId=${item.orderNo}`)"
            :info="item"
            :getOrderList="reset"
          ></GoodsOrderItem>
        </view>
      </template>
      <view v-else style="width: 100%; display: flex; justify-content: center">
        <u-empty mode="list"></u-empty>
      </view>
      <u-loadmore height="30" :status="pageStatus" />
    </view>
  </view>
</template>

<script setup lang="ts">
import { onBeforeMount, ref } from "vue";
import { goPage } from "@/utils/commonFn";
import GoodsOrderItem from "@/components/goodsOrderIten.vue";
//@ts-ignore
import { onReachBottom } from "@dcloudio/uni-app";
import { clubgetPointOrderLst } from "@/api/order";
type tabProps = {
  name: string;
  value: string;
  index?: number;
};
const { status } = defineProps<{
  status: any;
}>();
const tabActive = ref({
  index: 0,
  value: "",
});
const tabList = ref<tabProps[]>([
  {
    name: "全部",
    value: "",
  },
  {
    name: "待付款",
    value: "WAIT_PAY",
  },
  {
    name: "待收货",
    value: "IN_DISTRIBUTION ",
  },
  // {
  //   name: "退款/售后",
  //   value: "RETURN",
  // },
  {
    name: "已完成",
    value: "CONFIRM_RECEIPT",
  },
]);
const pageStatus = ref("loadmore");
const page = ref(1);
const orderList = ref<any[]>([{}]);
onBeforeMount(() => {
  getList();
});
const getList = async () => {
  if (pageStatus.value == "nomore") {
    return;
  }
  pageStatus.value = "loadmore";
  const res = await clubgetPointOrderLst({ pageNo: page.value, userId: uni.getStorageSync("userId"), status: tabActive.value.value });
  orderList.value = orderList.value.concat(res.orderList);
  if (!res.next) {
    pageStatus.value = "nomore";
  } else {
    pageStatus.value = "loadmore";
  }
};
const reset = () => {
  page.value = 1;
  pageStatus.value = "loadmore";
  orderList.value = [];
  getList();
};
onReachBottom(() => {
  page.value++;
  getList();
});
const tabClick = (e: tabProps) => {
  tabActive.value.index = e.index as number;
  tabActive.value.value = e.value;
  reset();
};
</script>

<style lang="less" scoped>
/deep/ .u-tabs__wrapper__nav__item {
  padding: 0 33px !important;
}
.main {
  margin-top: 20rpx;
}
</style>
